import React, { useState, useEffect } from 'react';
import { Input, Button, DatePicker, Upload, Alert, Cascader, Space, message } from 'antd';
import {} from '@ant-design/icons';
import moment from 'moment';
import 'antd/dist/antd.less';
import './BasicDetails.less';

export default function BasicDetails(props) {
  const activityList = props.activityList;
  // console.log(activityList.scheduleVOS);
  return (
    <div className="basicDetails">
      <div className="basicDetailsList">
        <div className="theFirstPage">
          <div className="theFirstPageLeft">活动名称：</div>
          <div className="theFirstPageRight">{activityList.activityName}</div>
        </div>
        <div className="theFirstPage">
          <div className="theFirstPageLeft">活动地点：</div>
          <div className="theFirstPageRight">
            {activityList.activitySite ? activityList.activitySite : '想啥呢你没有写这一项'}
          </div>
        </div>
        <div className="theFirstPage">
          <div className="theFirstPageLeft">活动时间：</div>
          <div className="theFirstPageRight">{`${activityList.startDate} - ${activityList.endDate}`}</div>
        </div>
        <div className="theFirstPage">
          <div className="theFirstPageLeft">活动内容：</div>
          <div className="theFirstPageRight">
            {activityList.activityContent ? activityList.activityContent : '想啥呢你没有写这一项'}
          </div>
        </div>
        <div className="theFirstPage">
          <div className="theFirstPageLeft">日程安排：</div>
          <div className="theFirstPageRight">
            {activityList.scheduleVOS?.[0] ? (
              activityList.scheduleVOS.map((item) => {
                return (
                  <div key={item.scheduleId} className="scheduleVOSLR">
                    <div className="scheduleVOSLeft">{item.scheduleDate}</div>
                    <div className="scheduleVOSRight">{item.scheduleName}</div>
                  </div>
                );
              })
            ) : (
              <div style={{ color: '#fc5531' }}>想啥呢你没有写这一项</div>
            )}
          </div>
        </div>
      </div>
    </div>
  );
}
